<template>
  <view>
    <u-tabs
      :list="list1"
      @click="click"
      lineWidth="0"
      :itemStyle="itemStyle"
      :activeStyle="activeStyle"
      :inactiveStyle="inactiveStyle"
    ></u-tabs>
    <view class="list-title">
      <view class="title-left">序号</view>
      <view class="title-mid">信息名称</view>
    </view>
    <u-list>
      <u-list-item v-for="(item, index) in list" :key="index">
        <view class="num">{{ index + 1 }}</view>
        <view class="title" @click="getDetail">{{ item.title }}</view>
      </u-list-item>
    </u-list>
  </view>
</template>

<script>
export default {
  props: {
    list: {
      type: Array,
      default: [],
    },
  },
  data() {
    return {
      list1: [
        {
          name: "战略类",
        },
        {
          name: "投资类",
        },
        {
          name: "风险类",
        },
        {
          name: "改革类",
        },
        {
          name: "人事类",
        },
        {
          name: "其他",
        },
      ],
      itemStyle: {
        flex: 1,
        width: "540rpx",
        height: "100rpx",
        lineHeight: "100rpx",
        padding: "0",
        border: "1px solid rgb(213,213,213)",
      },
      inactiveStyle: {
        width: "100%",
        height: "100%",
        textAlign: "center",
        fontSize: "52rpx",
      },
      activeStyle: {
        backgroundColor: "#409eff",
        color: "#ffffff",
        width: "100%",
        height: "100%",
        textAlign: "center",
        fontSize: "52rpx",
      },
      scrolltolower: true,
    };
  },
  methods: {
    click(item) {
      console.log("item", item);
    },
    getDetail() {
      let url = encodeURIComponent("/pdf/test.pdf");
      uni.navigateTo({
        url: `/pages/filePreview?link=${url}`,
      });
      // uni.downloadFile({
      //   url: "http://101.35.133.21:9009/test.pdf",
      //   success: function (res) {
      //     var filePath = res.tempFilePath;
      //     uni.openDocument({
      //       filePath: filePath,
      //       showMenu: true,
      //       success: function (res) {
      //         console.log("打开文档成功");
      //       },
      //     });
      //   },
      // });
    },
  },
};
</script>

<style lang="scss">
@import "@/static/css/_px2vw.scss";
.list-title {
  margin-top: vw(5);
  display: flex;
  background-color: #80bcff;
  height: vw(70);
  line-height: vw(70);
  .title-left {
    width: vw(70);
    text-align: center;
  }
  .title-mid {
    flex: 1;
    text-align: center;
  }
}
.u-list {
  height: calc(100vh - vw(130)) !important;
  overflow: auto;
  .u-list-item {
    flex-direction: row;
    height: vw(70);
    line-height: vw(70);
    background-color: rgba(242, 242, 242, 1);
    border-bottom: vw(1) solid rgba(215, 215, 215, 1);
    .num {
      width: vw(70);
      text-align: center;
    }
    .title {
      flex: 1;
    }
  }
}
</style>